<template>
  <div class='aui-card--fill scroll-box card-box'>
    <div class='pane-shell'>
      <search @sumbit='sumbit'>
        <!--  搜索项 -->
        <template slot='form'>
          <el-form :inline='true'
                   @submit.native.prevent
                   :model='dataForm'
                   ref='dataForm'>
            <el-form-item prop='classify'>
              <el-select v-model="dataForm.classify"
                         clearable
                         placeholder="请选择分类">
                <el-option v-for="item in classificationOptions"
                           :key="item.dictValue"
                           :label="item.dictName"
                           :value="item.dictValue">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item prop='label'
                          :rules="stringRule(false,0,50)">
              <el-input v-model='dataForm.label'
                        class='form-item'
                        clearable
                        placeholder='请输入标签'></el-input>
            </el-form-item>
            <el-form-item prop='headline'
                          :rules="stringRule(false,0,100)">
              <el-input v-model='dataForm.headline'
                        class='form-item'
                        clearable
                        placeholder='请输入标题'></el-input>
            </el-form-item>
            <el-form-item prop='status'>
              <el-select v-model="dataForm.status"
                         clearable
                         placeholder="请选择状态">
                <el-option v-for="item in statusOptions"
                           :key="item.dictValue"
                           :label="item.dictName"
                           :value="item.dictValue">
                </el-option>
              </el-select>
            </el-form-item>
          </el-form>
        </template>
        <!--  操作按钮 -->
        <template slot='btns'>
          <el-button type="primary"
                     plain
                     icon="el-icon-plus"
                     v-if="$hasPermission('tb:information:addInformation')"
                     @click="addOrUpdateHandle()">{{ $t('add') }}咨讯</el-button>
        </template>
      </search>
      <table-template :tableData='tableData'
                      :loading='dataListLoading'
                      :fieldManagement='false'
                      :index="true"
                      :dataList='dataList'>
        <template slot="label-before">
          <el-table-column prop="classify"
                           label='分类'
                           align="center"
                           width="100">
            <template slot-scope='scope'>
              {{scope.row.classify === 0 ? '政策新闻' : scope.row.classify === 1 ? '典型案例' : '线上培训'}}
            </template>
          </el-table-column>
        </template>
        <el-table-column :label="$t('handle')"
                         fixed='right'
                         header-align='center'
                         align='center'
                         v-if='dataList.length'
                         width='180'>
          <template slot-scope='scope'>
            <el-button type='text'
                       class='success'
                       @click='openDialog("ConsultingManagementInfo",scope.row.id)'
                       size='small'>详情</el-button>
            <el-button type='text'
                       class='brand'
                       v-if="$hasPermission('tb:information:updateInformation')"
                       @click='addOrUpdateHandle(scope.row.id)'
                       size='small'>修改</el-button>
            <el-button type='text'
                       class='warning'
                       v-if="$hasPermission('tb:information:updateStatus')"
                       @click='setStatus(scope.row)'
                       size='small'>{{scope.row.status === 1 ? '下架':'发布'}}</el-button>
            <el-button type='text'
                       size='small'
                       v-if="scope.row.status !== 1 && $hasPermission('tb:information:delInformation')"
                       class='danger'
                       @click='deleteHandle({id:scope.row.id})'>{{ $t('delete')}}</el-button>
          </template>
        </el-table-column>
      </table-template>
      <el-pagination :current-page='page'
                     :page-sizes='[10,20,50,100]'
                     :total='total'
                     layout='total, sizes, prev, pager, next'
                     @size-change='pageSizeChangeHandle'
                     @current-change='pageCurrentChangeHandle'>
      </el-pagination>
    </div>
    <consultation-list-add-or-update ref="addOrUpdate"
                                     @callBack="getDataList()" />
    <consulting-management-info ref="ConsultingManagementInfo" />
  </div>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
import minFormValidate from '@/mixins/form-validate'
import tableTemplate from '@/components/table-template'
import Search from '@/components/search/search'
import ConsultationListAddOrUpdate from './consultation-list-add-or-update.vue'
import ConsultingManagementInfo from './consulting-management.info.vue'
export default {
  mixins: [mixinViewModule, minFormValidate],
  name: '',
  data () {
    return {
      mixinViewModuleOptions: {
        updateStatusURL: '/tb/information/updateStatus', // 修改状态
        getDataListURL: '/tb/information/getInformationPage', // 获取资讯列表
        getDataListIsPage: true, // 数据列表接口，是否需要分页？
        addOrUpdateURL: '', // 添加或修改接口，API地址
        getDataInfoURL: '', // 数据详情，API地址
        deleteURL: '/tb/information/delInformation', // 删除接口，API地址
        deleteIsBatch: true, // 删除接口，是否需要批量？
        exportURL: '' // 导出接口，API地址
      },
      dataList: [],
      dataForm: {},
      classificationOptions: [{
        dictName: '政策新闻',
        dictValue: 0
      }, {
        dictName: '典型案例',
        dictValue: 1
      }, {
        dictName: '线上培训',
        dictValue: 2
      }],
      statusOptions: [{
        dictName: '未发布',
        dictValue: 0
      }, {
        dictName: '已发布',
        dictValue: 1
      }, {
        dictName: '已下架',
        dictValue: 2
      }]
    }
  },
  components: { tableTemplate, Search, ConsultationListAddOrUpdate, ConsultingManagementInfo },
  computed: {
    tableData () {
      return [
        { label: '标签', width: '80', prop: 'label' },
        { label: '标题', width: '120', prop: 'headline' },
        { label: '副标题', width: '120', prop: 'subheading' },
        { label: '状态', width: '80', prop: 'status', selectList: this.statusOptions },
        { label: '创建者', width: '100', prop: 'createName' },
        { label: '发布时间', width: '150', prop: 'releaseDate' },
        { label: '更新人', width: '100', prop: 'updateName' },
        { label: '更新时间', width: '150', prop: 'updateDate' }
      ]
    }
  },
  methods: {
    // 修改状态
    setStatus (row) {
      this.putData({
        url: this.mixinViewModuleOptions.updateStatusURL,
        paramData: {
          id: row.id,
          status: row.status === 1 ? 2 : 1
        }
      }).then(res => {
        if (res.code !== 0) {
          return
        }
        this.$message.success('修改成功')
        this.getDataList()
      })
    },
    sumbit () {
      this.$refs.dataForm.validate((valid) => {
        if (valid) {
          this.getPageInit()
        }
      })
    }
  }
}
</script>
<style lang="scss" scoped>
</style>
